<template>
	<view class="shopDetail">
		<view class="banner">
			<swiper class="swiper" circular :indicator-dots="false" :autoplay="true" :interval="4000" :duration="500" :style="'max-height:'+maxHeight+'px;height:'+swHeight+'px;'">
				<swiper-item v-for="(item,index) in datas.loops" :key='index'>
					<view class="swiper-item imgPublic">
						<image :src="item" mode="widthFix" @tap='lookBig2(item)' @load="getHeight"></image>
					</view>
				</swiper-item>
			</swiper>
		</view>
		<view class="config" v-if='actType == "0"'>
			<view class="prices dFlex jStart_aCenter">
				<view class="newPrice">¥{{datas.min_price > 0?datas.min_price:datas.price}}</view>
				<view class="oldPrice">¥{{datas.old_price?datas.old_price:'0.00'}}</view>
				<view class='yongjin dFlex jStart_aCenter' v-if='userData.auth_status == "2"'>
					<view class='showYJ'>佣</view>
					<text>{{(parseFloat(datas.min_price) * parseFloat(datas.service_rate) / 100).toFixed(2)}}</text>
				</view>
			</view>
			<view class="tags dFlex jStart_aCenter" v-if='datas.tags'>
				<text class="tagOne" v-for="(item2,index2) in datas.tags.split(';').slice(0,3)" :key='index2'>{{item2}}</text>
				<!-- <text class="tagOne" v-for="(item2,index2) in datas.tags_arr" :key='index2'>{{item2}}</text> -->
			</view>
			<view class="shopName">{{datas.title}}</view>
		</view>
		<view class='activePrice dFlex jBetween_aCenter' v-else>
			<view class="showPrice">
				<text v-if='actType == "1"'>团购价</text>
				<text v-if='actType == "2"'>秒杀价</text>
				<text v-if='actType == "4"'>新人礼</text>
				<view class='actPrice'>
					￥<text>{{datas.min_price > 0?datas.min_price:datas.price}}</text>
					<text class='oldPrice'>¥{{datas.old_price?datas.old_price:'0.00'}}</text>
				</view>
			</view>
			<view class="showDesc" v-if='actType == "1"'>限时团购</view>
			<view class="showDesc" v-if='actType == "2"'>天天秒杀</view>
			<view class="showDesc" v-if='actType == "4"'>新人大礼包</view>
			<view class='lei imgPublic'>
				<image src="https://zl-tuangou.oss-cn-qingdao.aliyuncs.com/cMini/lei.png" mode="widthFix"></image>
			</view>
		</view>
		<view class="spec dFlex jBetween_aCenter">
			<text>选择</text>
			<view class="specVal dFlex jBetween_aCenter" @tap='specFlag = !specFlag'>
				<view class="ipt">
					<input type="text" placeholder="请选择数量、规格" v-model="selSpecStr" disabled placeholder-style="font-size:12px;">
				</view>
				<view class="rightIcon imgPublic">
					<image src="https://zl-tuangou.oss-cn-qingdao.aliyuncs.com/cMini/rightIcon.png" mode="widthFix"></image>
				</view>
			</view>
		</view>
		<view class="desc">
			<view class="title">商品评价</view>
			<view class="comment" v-if="comment.length">
				<view class="commentOne" v-for="(item,index) in comment" :key='index'>
					<view class="info dFlex jBetween_aCenter">
						<view class="userInfo dFlex jStart_aCenter">
							<view class="userTx imgPublic">
								<image :src="item.avatar"></image>
							</view>
							<view class="other">
								<text>{{item.user_name}}</text>
								<view class="rateBox">
									<u-rate :count="5" inactive-color='#e8e8e8' v-model='item.zh_score' disabled active-color='#FFB800' size='30'></u-rate>
								</view>
							</view>
						</view>
						<view class="createTime">{{exchangeTime(item.createtime)}}</view>
					</view>
					<view class="content">
						<view class="desc">{{item.content}}</view>
						<view class="imgs dFlex fWap jStart_aStart" v-if="item.image_arr.length">
							<view v-for="(item2,index2) in item.image_arr" class='smallImg'>
								<view class="imgOne imgPublic" @tap='lookBig(item2,index)' :key='index2' v-if="index2<3">
									<image :src="item2" mode="widthFix"></image>
									<view class="smallZz" v-if='index2 == 2 && item.image_arr.length>3'>+{{item.image_arr.length-3}}</view>
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>
			<view class="comment empty imgPublic" v-else>
				<image src="https://zl-tuangou.oss-cn-qingdao.aliyuncs.com/cMini/empty.png" mode="widthFix"></image>
			</view>
		</view>
		<view class="advDetail">
			<view class="shopsTit dFlex jCenter_aCenter">
				<view class="titIcon imgPublic">
					<image src="https://zl-tuangou.oss-cn-qingdao.aliyuncs.com/cMini/menuIcon2.png" mode="widthFix"></image>
				</view>
				<view class="menuDesc imgPublic">
					<image src="https://zl-tuangou.oss-cn-qingdao.aliyuncs.com/cMini/menuDesc2.png" mode="widthFix"></image>
				</view>
			</view>
			<view class="showDesc" v-html='datas.content'></view>
		</view>
		<view class="shopsTit dFlex jCenter_aCenter">
			<view class="titIcon imgPublic">
				<image src="https://zl-tuangou.oss-cn-qingdao.aliyuncs.com/cMini/menuIcon3.png" mode="widthFix"></image>
			</view>
			<view class="menuDesc imgPublic">
				<image src="https://zl-tuangou.oss-cn-qingdao.aliyuncs.com/cMini/menuDesc3.png" mode="widthFix"></image>
			</view>
		</view>
		<!-- 推荐商品 -->
		<view class="tuijian">
			<view class="tj_shop dFlex jStart_aStart" @click='id=item.id;actType="0";initData()' v-for="(item,index) in groomShop" :key='index'>
				<view class="shopImg imgPublic">
					<image :src="item.main_img" mode="widthFix"></image>
					<!-- <view class="newIcon">新人专享</view> -->
					<view class='yjCount dFlex jAround_aCenter' v-if='userData.auth_status == "2"'>
						<view class='showYJ'>佣</view>
						<text>{{(parseFloat(item.min_price) * parseFloat(item.service_rate) / 100).toFixed(2)}}</text>
					</view>
				</view>
				<view class="shopInfo">
					<view class="shopName">{{item.title}}</view>
					<text class='huigou'>回购多次</text>
					<view class="tool dFlex jBetween_aEnd">
						<view class="price">￥<text>{{item.min_price > 0?parseFloat(item.min_price):parseFloat(item.price)}}</text></view>
						<!-- <view class="jiagou">立即加购</view> -->
					</view>
				</view>
			</view>
		</view>
		<view class="toolBtns">
			<button open-type='contact' class="tool_btn imgPublic">
				<image src='https://zl-tuangou.oss-cn-qingdao.aliyuncs.com/cMini/service2.png' mode='widthFix'></image>
			</button>
			<view class="tool_btn imgPublic" @click='backTop'>
				<image src='https://zl-tuangou.oss-cn-qingdao.aliyuncs.com/cMini/backTop.png' mode='widthFix'></image>
			</view>
		</view>
		<view class="seat"></view>
		<view :class="['btns','dFlex','jBetween_aCenter',device=='ios'?'ios_sureBtn':'']">
			<view class="btnLeft dFlex jStart_aCenter">
				<view class="btnTool" @tap.stop='goBack()'>
					<view class="btnIcon imgPublic">
						<image src="../static/menu0/menu2.png" mode="widthFix"></image>
					</view>
					<text>商城</text>
				</view>
				<view class="btnTool" @tap.stop='goCar' v-if="invite_id <= '0'">
					<view class="btnIcon imgPublic">
						<image src="../static/menu0/menu3.png" mode="widthFix"></image>
					</view>
					<text>购物车</text>
				</view>
			</view>
			<view class="btnRight dFlex jEnd_aCenter" v-if="isLogin && datas.act_type == '0'">
				<view class="addCar" @tap.stop='addCar'>加入购物车</view>
				<view class="buy" @tap.stop='beforeOrder'>立即购买</view>
			</view>
			<view class="btnRight dFlex jEnd_aCenter" v-if='isLogin && datas.act_type == "4"' style="width: 70%;">
				<view class="loginBtn" @tap.stop='beforeOrder'>立即购买</view>
			</view>
			<view class="btnRight dFlex jEnd_aCenter" v-if='isLogin && (datas.act_type == "1" || datas.act_type == "2")' style="width: 70%;">
				<view class="loginBtn" @tap.stop='joinActive'>参加活动</view>
			</view>
			<view class="btnRight dFlex jEnd_aCenter" v-if='!isLogin' style="width: 70%;">
				<button class="loginBtn" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">登录</button>
			</view>
		</view>
		<!-- 遮罩 商品规格 -->
		<view class="zz dFlex flexDirection jEnd_aCenter" v-if="specFlag">
			<view class="spec">
				<view class="closeIcon imgPublic" @tap.stop='specFlag = false'>
					<image src="https://zl-tuangou.oss-cn-qingdao.aliyuncs.com/cMini/closeIcon.png" mode="widthFix"></image>
				</view>
				<view class="shopInfo dFlex jStart_aStart">
					<view class="shopImg imgPublic">
						<image :src="datas.main_img" mode="widthFix"></image>
					</view>
					<view class="other">
						<view class="shopName">{{datas.title}}</view>
						<view class="selSpec">{{selSpecStr?selSpecStr+"  x"+count:'未选择规格数量'}}</view>
						<view class="price">¥{{showPrice?parseFloat(showPrice * count).toFixed(2):parseFloat(datas.price).toFixed(2)}}</view>
					</view>
				</view>
				<view class="specList">
					<text class="title">规格</text>
					<view class="part" v-for="(item,index) in spec" :key='index'>
						<text class="tit">{{item.name}}</text>
						<view class="partList dFlex jStart_aStart fWap" v-if="item.arr.length">
							<view :class="['specOne',selSpec[index].id == item2.id?'active':'']" v-for="(item2,index2) in item.arr" :key='index2' @tap.stop='selSpecOne(index,index2)'>{{item2.name}}</view>
						</view>
					</view>
				</view>
				<view class="specList dFlex jBetween_aCenter">
					<text class="title">数量</text>
					<u-number-box :max='datas.xg_num > 0 ? datas.xg_num : 999' v-model="count" @change="changeCount" :min='1' bg-color='#ffffff'></u-number-box>
				</view>
				<view :class="['sureBtn',device == 'ios'?'ios_sureBtn':'']" @tap.stop='closeSpec'>确定</view>
			</view>
		</view>
		<!-- 分享 -->
		<view class="zz dFlex flexDirection jStart_aCenter zz2" v-if='postFlag'>
			<canvas canvas-id="myCanvas" id="myCanvas" :style="'width:90%;height:'+canvasHeight+'px;'"></canvas>
			<view class="seat"></view>
			<view :class="['opBtns',device == 'ios'?'ios_sureBtn':'']">
				<view class='toast'>立即分享</view>
				<view class='btns dFlex jAround_aCenter'>
					<button open-type="share" class="opBtnOne">
						<view class="btnImg imgPublic">
							<image src="https://zl-tuangou.oss-cn-qingdao.aliyuncs.com/cMini/weixin.png" mode="widthFix"></image>
						</view>
						<text>微信好友</text>
					</button>
					<view class="opBtnOne" @tap.stop='saveImg'>
						<view class="btnImg imgPublic">
							<image src="https://zl-tuangou.oss-cn-qingdao.aliyuncs.com/cMini/shareIcon4.png" mode="widthFix"></image>
						</view>
						<text>保存图片</text>
					</view>
				</view>
				<view class='close' @tap.stop='postFlag = false'>关闭</view>
			</view>
		</view>
		<!-- 名片海报 -->
		<view class="zz dFlex jCenter_aCenter zz3">
			<canvas canvas-id="myCanvas2" id="myCanvas2" :style="'width:100%;height:'+cardHeight+'px;'"></canvas>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				maxHeight:'',
				swHeight:'',
				id:'',
				actType:'',
				actId:'',
				tjr_mobile:"",
				specFlag:false,
				isLogin:false,
				
				datas:{
					
				},//商品信息
				spec:[],//规格数组
				selSpec:[],
				
				count:1,//购买数量
				selSpecStr:'',
				selSpecId:'',
				showPrice:'',
				canOrder:true,
				
				comment:[],
				device:getApp().globalData.platform,
				
				btnNum:'',
				code:'',
				
				status:"",// 1 单规格商品 2 多规格商品
				userData:{auth_status:'-1'},
				kind:0,// 1 团长跳转分享
				mobile:'',
				
				
				// canvasHeight:'580',
				canvasHeight:'522',
				adv:'',
				postFlag:false,
				code:"",
				teamLeader:{},
				// 分享卡片
				cardHeight:uni.getSystemInfoSync().windowWidth / (5/4),
				card:'',
				Teamcode:'',
				link:'',
				
				invite_id:'',
				need_num:'',
				// 推荐商品
				groomShop:[],
			};
		},
		onLoad(e) {
			if(e.scene){
				let canshu = decodeURIComponent(e.scene)?decodeURIComponent(e.scene):'';
				this.link = canshu;
				let csArr = canshu.split('&');
				this.id = csArr[0].split('=')[1];
				this.mobile = csArr[1].split('=')[1];
				this.tjr_mobile = csArr[1].split('=')[1];
				this.actType = 0;
				uni.setStorageSync('tjr_mobile',this.tjr_mobile);
			}else{
				this.link = this.tool.objToUrl(e);
				this.id = e.id?e.id:'';
				this.actType = e.actType>=0?e.actType:0;
				this.actId = e.actId?e.actId:'';
				if(e.shareId){
					uni.setStorageSync('shareInfo',{
						time:new Date().getTime(),
						id:'',
						shareId:e.shareId
					});
				}
				if(e.tjr_mobile){
					uni.setStorageSync('tjr_mobile',e.tjr_mobile);
					this.tjr_mobile = e.tjr_mobile?e.tjr_mobile:'';
					this.mobile = e.tjr_mobile;
				}
				if(e.kind){
					this.kind = 1;
				}
				if(e.specFlag){
					this.specFlag = true;
					this.btnNum = '1';
				}
			}
			// 获取轮播图高度
			this.maxHeight = uni.getSystemInfoSync().windowWidth * 0.94;
			if(this.id){
				this.initData();
			}
		},
		onShow() {
			this.isLogin = uni.getStorageSync('uToken')?true:false;
			if(!this.isLogin){
				wx.login({
					success:(login)=>{
						this.code = login.code;
					},
					fail:(err)=>{
						console.log(err);
					}
				})
			}else{
				this.initUser();
			}
			if(this.id){
				// 评价列表
				this.initComment();
			}
			// 获取推荐商品
			this.getTuiJian();
		},
		onShareAppMessage() {
			let share = {};
			if(this.kind){
				share.title = this.datas.title;
				share.path = '/seller/shopDetail?id='+this.datas.id+'&tjr_mobile='+this.mobile+'&shareId='+(uni.getStorageSync('uId')?uni.getStorageSync('uId'):'');
				// share.imageUrl = this.adv;
				share.imageUrl = this.card?this.card:this.datas.main_img;
				share.desc = this.datas.description;
			}else{
				share.title = this.datas.title;
				share.path = '/seller/shopDetail?id='+this.datas.id+'&tjr_mobile='+this.mobile+'&shareId='+(uni.getStorageSync('uId')?uni.getStorageSync('uId'):'');
				share.imageUrl = this.card?this.card:this.datas.main_img;
				share.desc = this.datas.description;
			}
			return share;
		},
		onShareTimeline() {
			let share = {};
			if(this.kind){
				share.title = this.datas.title;
				share.path = '/seller/shopDetail?id='+this.datas.id+'&tjr_mobile='+this.mobile+'&shareId='+(uni.getStorageSync('uId')?uni.getStorageSync('uId'):'');
				share.imageUrl = this.card?this.card:this.datas.main_img;
				share.desc = this.datas.description;
			}else{
				share.title = this.datas.title;
				share.path = '/seller/shopDetail?id='+this.datas.id+'&tjr_mobile='+this.mobile+'&shareId='+(uni.getStorageSync('uId')?uni.getStorageSync('uId'):'');
				share.imageUrl = this.card?this.card:this.datas.main_img;
				share.desc = this.datas.description;
			}
			return share;
		},
		methods:{
			// 推荐商品
			getTuiJian(){
				this.tool.getData('/api/mall/getGoodsList',{
					page:1,
					pageSize:20,
					is_tj:'1',
				}).then(res=>{
					console.log('推荐商品');
					console.log(res);
					if(res){
						this.groomShop = res.length ? res : [];
					}
				}).catch(err=>{
					console.log(err);
				})
			},
			// 返回顶部
			backTop(){
				uni.pageScrollTo({
					scrollTop:0,
				})
			},
			// 用户信息
			initUser(){
				this.tool.getData('/api/user/info',{},'',this).then(res=>{
					if(res){
						this.mobile = res.mobile;
						this.userData = res;
					}
				}).catch(err=>{
					console.log(err);
				})
			},
			// 商品详情
			initData(){
				this.tool.getData('/api/mall/getGoodsDetail',{
					id:this.id,
					act_type:this.actType,
					act_id:this.actId,
					tjr_mobile:this.tjr_mobile,
				}).then(res=>{
					if(res){
						console.log(res);
						/* if(res.act_type == '2'){//秒杀
							this.initCard2(res);
						}else{
							this.initCard(res);
						} */
						uni.pageScrollTo({
							scrollTop: 0,
							duration: 300,
							fail:(err)=>{
								console.log(err);
							}
						});
						res.loops = res.loops.split(',');
						const reg = new RegExp('<img', 'gi');
						res.content= res.content.replace(reg, `<img style="width: 100%!important;"`);
						this.invite_id = res.invite_id;
						this.need_num = res.need_num;
						this.datas = res;
						if(this.kind){
							this.postFlag = true;
							this.initCode();
						}
						if(res.use_attr){//多规格
							this.status = '2';
							// 规格名称
							let spec_name = res.attr_group.split('_');
							spec_name.map((item,index)=>{
								this.spec.push({
									name:item,
									arr:[],
								})
							})
							// 规格值
							res.attribute_list.map((item,index)=>{
								let item_ids = item.id.split('_');
								let item_name = item.name.split('_');
								item_ids.map((item2,index2)=>{
									let idx = this.tool.getIdx(this.spec[index2].arr,'id',item2);
									if(idx == -1){
										this.spec[index2].arr.push({
											id:item2,
											name:item_name[index2]
										})
									}
								})
							})
							for(let i=0;i<this.spec.length;i++){
								this.selSpec.push(this.spec[i].arr[0]);
								this.selSpecStr = i!=this.spec.length-1?this.selSpecStr+this.spec[i].arr[0].name+"_":this.selSpecStr+this.spec[i].arr[0].name;
								this.selSpecId = i!=this.spec.length-1?this.selSpecId+this.spec[i].arr[0].id+"_":this.selSpecId+this.spec[i].arr[0].id;
							}
							// 选择的规格的价格
							for(let i=0;i<res.attribute_list.length;i++){
								if(res.attribute_list[i].id == this.selSpecId){
									this.showPrice = res.attribute_list[i].price;
									if(res[i].stock>0){
										this.canOrder = true;
									}else{
										this.canOrder = false;
									}
								}
							}
						}else{ // 默认规格
							this.status = '1';
							this.spec = [
								{
									name:'默认规格',
									arr:[{id:'0',name:'默认规格',stock:res.stock,price:res.price,weight:res.weight}]
								}
							],
							this.selSpec = [{id:'0',name:"默认规格"}];
							this.selSpecStr = '默认规格';
							this.showPrice = res.min_price;
						}
						if(res.stock<=0){
							this.canOrder = false;
						}
						
					}
				}).catch(err=>{
					
				})
			},
			// 名片图
			initCard(datas){
				var ctx = uni.createCanvasContext('myCanvas2', this);
				let canvasWidth = uni.getSystemInfoSync().windowWidth;
				let canvasHeight = this.cardHeight;
				setTimeout(()=>{
					// 填充背景色，白色
					ctx.setFillStyle('#FFFFFF'); // 默认白色
					ctx.fillRect(0, 0,canvasWidth,canvasHeight); // fillRect(x,y,宽度，高度)
					uni.downloadFile({
						url:datas.main_img,
						success: (shop) => {
							console.log(shop);
							let imgWH = canvasWidth * 0.48;
							ctx.drawImage('../static/images/shareBg.png',0,0,canvasWidth,canvasHeight);
							// ctx.drawImage(shop.tempFilePath,(canvasWidth - imgWH) / 2,12,imgWH,imgWH);
							ctx.drawImage(shop.tempFilePath,(canvasWidth - imgWH) / 6 * 5.25,38,imgWH,imgWH);
							ctx.setFontSize(38); // 字号
							ctx.setFillStyle('#ffffff'); // 字体颜色
							ctx.fillText(datas.min_price,20,canvasHeight - 16);//绘制截取部分
							/* let tagBoxWidth = canvasWidth;
							let tagBoxHeight = 30;
							ctx.fillStyle = "rgb(255,247,143)";
							ctx.fillRect(0, canvasHeight - 85, tagBoxWidth, tagBoxHeight);
							let tagsStr = '';
							let arr = datas.tags.split(';').slice(0,3);
							for(let i=0;i<arr.length;i++){
								if(i == arr.length-1){
									tagsStr = tagsStr+arr[i];
								}else{
									tagsStr = tagsStr+arr[i]+"   |   "
								}
							}
							ctx.setFontSize(14); // 字号
							ctx.setFillStyle('#c21a00'); // 字体颜色
							let strLen = ctx.measureText(tagsStr).width;
							ctx.fillText(tagsStr,(canvasWidth - strLen) / 2,canvasHeight - 65);//绘制截取部分 */
						},
						fail:(err)=>{
							uni.showToast({
								title:"产品图下载失败",
								icon:"none"
							})
						},
						complete: () => {
							ctx.draw(true,()=>{
								setTimeout(()=>{
									uni.canvasToTempFilePath({ // 保存canvas为图片
										canvasId: 'myCanvas2',
										quality: 1,
										width:canvasWidth,
										height:canvasHeight,
										destWidth:canvasWidth * 3,
										destHeight:canvasHeight * 3,
										complete: (res)=> {
											uni.getFileSystemManager().saveFile({
												tempFilePath:res.tempFilePath,
												success: (file) => {
													this.card = file.savedFilePath;
												},
												fail: (err) => {
													
												}
											})
										},
									},this) // 这里是新增的this，只有在微信小程序中需要加入，不然会报错
								},500)
							})
						}
					})
					
				},500)
			},
			initCard2(datas){
				var ctx = uni.createCanvasContext('myCanvas2', this);
				let canvasWidth = uni.getSystemInfoSync().windowWidth;
				let canvasHeight = this.cardHeight;
				setTimeout(()=>{
					// 填充背景色，白色
					ctx.setFillStyle('#FFFFFF'); // 默认白色
					ctx.fillRect(0, 0,canvasWidth,canvasHeight); // fillRect(x,y,宽度，高度)
					uni.downloadFile({
						url:datas.main_img,
						success: (shop) => {
							let imgWH = canvasWidth * 0.5;
							ctx.drawImage('../static/images/shareBg2.png',0,0,canvasWidth,canvasHeight);
							ctx.drawImage(shop.tempFilePath,(canvasWidth - imgWH) / 6 * 5.25,48,imgWH,imgWH);
							ctx.setFontSize(24); // 字号
							ctx.setFillStyle('#ffffff'); // 字体颜色
							ctx.fillText(datas.min_price,16,canvasHeight - 20);//绘制截取部分
						},
						fail:(err)=>{
							uni.showToast({
								title:"产品图下载失败",
								icon:"none"
							})
						},
						complete: () => {
							ctx.draw(true,()=>{
								setTimeout(()=>{
									uni.canvasToTempFilePath({ // 保存canvas为图片
										canvasId: 'myCanvas2',
										quality: 1,
										width:canvasWidth,
										height:canvasHeight,
										destWidth:canvasWidth * 3,
										destHeight:canvasHeight * 3,
										complete: (res)=> {
											uni.getFileSystemManager().saveFile({
												tempFilePath:res.tempFilePath,
												success: (file) => {
													this.card = file.savedFilePath;
												},
												fail: (err) => {
													
												}
											})
										},
									},this) // 这里是新增的this，只有在微信小程序中需要加入，不然会报错
								},500)
							})
						}
					})
					
				},500)
			},
			// 直接下单
			beforeOrder(){
				this.btnNum = '2';
				if(this.datas.use_attr){//多规格
					this.specFlag = true;
					return;
					if(this.selSpec.length != this.spec.length){
						this.specFlag = true;
						return;
					}
					let goods_attr_id = '';
					this.selSpec.map((item,index)=>{
						if(index!=this.selSpec.length-1){
							goods_attr_id = goods_attr_id+item.id+'_';
						}else{
							goods_attr_id = goods_attr_id+item.id;
						} 
					})
					// 判断选择的规格是否还有库存
					this.datas.attribute_list.map((item,index)=>{
						if(item.id == goods_attr_id && item.stock<=0){
							uni.showToast({
								title:'该规格库存不足',
								icon:"none"
							})
							return;
						}
					})
				}else{//单规格
					if(this.datas.stock<=0){
						uni.showToast({
							title:'该商品库存不足',
							icon:"none"
						})
						return;
					}
					this.specFlag = true;
					return;
				}
				let shopInfo = [
					{
						id:this.id,
						main_img:this.datas.main_img,
						title:this.datas.title,
						count:this.count,
						specName:this.datas.use_attr?this.selSpecStr:'默认',
						specId:this.datas.use_attr?this.selSpecId:'',
						showPrice:this.showPrice,
					}
				];
				uni.navigateTo({
					url:'./beforeOrder?status=1&shopInfo='+JSON.stringify(shopInfo)+"&inviteId="+this.invite_id+'&need_num='+this.need_num+'&actType='+this.actType+'&actId='+this.actId,
				})
			},
			// 选择规格
			selSpecOne(idx1,idx2){
				let arr = this.spec[idx1].arr;
				this.selSpec.splice(idx1,1,arr[idx2]);
				// 选择的规格的名称
				this.selSpecStr = '';
				this.selSpecId = '';
				this.selSpec.map((item,index)=>{
					if(index!=this.selSpec.length-1){
						this.selSpecStr = this.selSpecStr + item.name + '_';
						this.selSpecId = this.selSpecId + item.id + '_';
					}else{
						this.selSpecStr = this.selSpecStr + item.name;
						this.selSpecId = this.selSpecId + item.id;
					}
				})
				// 选择的规格的价格
				for(let i=0;i<this.datas.attribute_list.length;i++){
					if(this.datas.attribute_list[i].id == this.selSpecId){
						this.showPrice = this.datas.attribute_list[i].price;
						if(this.datas.attribute_list[i].stock>0){
							this.canOrder = true;
						}else{
							this.canOrder = false;
						}
					}
				}
			},
			// 轮播图高度
			getHeight(e){
				this.swHeight = uni.getSystemInfoSync().windowWidth / (e.detail.width / e.detail.height);
			},
			// 修改购买数量
			changeCount(e){
				if(this.actType == '4' && datas.xg_num > 0 && e.value > datas.xg_num){
					this.count = datas.xg_num;
				}else{
					this.count = e.value;
				}
			},
			// 返回商城首页
			goBack(){
				uni.switchTab({
					url:'../pages/seller'
				})
			},
			// 跳转到购物车
			goCar(){
				uni.switchTab({
					url:'../pages/car'
				})
			},
			// 添加到购物车
			addCar(){
				this.btnNum = '1';
				if(this.isLogin){
					if(this.datas.use_attr){//多规格
						this.specFlag = true;
						return;
						if(this.selSpec.length == this.spec.length){//已选择规格
							let goods_attr_id = '';
							this.selSpec.map((item,index)=>{
								if(index!=this.selSpec.length-1){
									goods_attr_id = goods_attr_id+item.id+'_';
								}else{
									goods_attr_id = goods_attr_id+item.id;
								}
							})
							// 判断选择的规格是否还有库存
							this.datas.attribute_list.map((item,index)=>{
								if(item.id == goods_attr_id && item.stock<=0){
									uni.showToast({
										title:'该规格库存不足',
										icon:"none"
									})
									return;
								}
							})
							this.tool.getData('/api/mall/addShoppingCart',{
								goods_id:this.id,
								goods_attr_id:goods_attr_id,
								num:this.count
							}).then(res=>{
								if(res){
									uni.showToast({
										title:'已添加到购物车',
										icon:'success'
									})
								}
							}).catch(err=>{
								console.log(err);
							})
						}else{//未选择规格
							this.specFlag = true;
						}
					}else{//单规格
						this.tool.getData('/api/mall/addShoppingCart',{
							goods_id:this.id,
							goods_attr_id:'',
							num:this.count
						}).then(res=>{
							if(res){
								uni.showToast({
									title:'已添加到购物车',
									icon:'success'
								})
							}
						}).catch(err=>{
							console.log(err);
						})
					}
				}else{
					uni.showToast({
						title:'请先登录',
						icon:"none"
					})
				}
			},
			// 评价列表
			initComment(){
				this.tool.getData('/api/mall/getGoodsCommentList',{
					id:this.id
				}).then(res=>{
					if(res){
						this.comment = res;
					}
				}).catch(err=>{
					console.log(err);
				})
			},
			// 查看大图
			lookBig(url,idx){
				let imgArr = this.comment[idx].image_arr;
				uni.previewImage({
					current:url,
					urls:imgArr,
				})
			},
			// 查看轮播大图
			lookBig2(url){
				uni.previewImage({
					current:url,
					urls:this.datas.loops,
				})
			},
			// 转换时间
			exchangeTime(time){
				return this.tool.timestampToTime(time * 1000);
			},
			// 参加活动
			joinActive(){
				if(this.datas.act_type == '1'){//拼团
					uni.navigateTo({
						url:"../my/activeDetail?pageIdx=3&ptid="+this.datas.act_id,
					})
				}else if(this.datas.act_type == '2'){//秒杀
					uni.navigateTo({
						url:'./seckill?msid='+this.datas.act_id,
					})
				}
			},
			// 一键登录
			getPhoneNumber(e) {
				if (e.detail.errMsg == "getPhoneNumber:fail user deny") { //用户决绝授权  
					uni.showToast({
						title:'用户拒绝授权',
						icon:"none"
					})
				} else {
					this.tool.getData('/api/weixin/jscode2session',{
						code:this.code
					}).then(res=>{
						if(res){
							this.tool.getData('/api/weixin/programLogin',{
								encrypt: e.detail.encryptedData,
								iv: e.detail.iv,
								session_key: JSON.parse(res).session_key,
								openid: JSON.parse(res).openid,
								source:'0',
								// param: this.tjr_mobile,
								tjr_mobile:uni.getStorageSync('tjr_mobile')?uni.getStorageSync('tjr_mobile'):'',
							}).then(res=>{
								if(res){
									uni.showToast({
										title:'登录成功',
										icon:"none"
									})
									uni.setStorageSync('uToken',res.userinfo.token);
									uni.setStorageSync('uId',res.userinfo.id);
									uni.setStorageSync('user_level',res.userinfo.user_level);
									getApp().globalData.isLogin = true;
									this.isLogin = true;
								}
							}).catch(err=>{
								console.log(err);
							})
						}else{
							wx.login({
								success:(info)=>{
									if (info.code) {
										this.tool.getData('/api/weixin/jscode2session',{
											code:info.code
										}).then(res=>{
											if(res){
												this.tool.getData('/api/weixin/programLogin',{
													encrypt: e.detail.encryptedData,
													iv: e.detail.iv,
													session_key: JSON.parse(res).session_key,
													openid: JSON.parse(res).openid,
													param: this.tjr_mobile,
												}).then(res=>{
													if(res){
														uni.showToast({
															title:'登录成功',
															icon:"none"
														})
														uni.setStorageSync('uToken',res.userinfo.token);
														getApp().globalData.isLogin = true;
														uni.setStorageSync('uId',res.userinfo.id);
														uni.setStorageSync('user_level',res.userinfo.user_level);
														this.isLogin = true;
													}
												}).catch(err=>{
													console.log(err);
												})
											}else{
												
											}
										}).catch(err=>{
											console.log(err);
										})
									}
								}
							})
						}
					}).catch(err=>{
						console.log(err);
					})
				}
			},
			// 关闭规格弹窗
			closeSpec(){
				if(this.canOrder){
					if(this.selSpec.length == this.spec.length){//已选择规格
						let goods_attr_id = '';
						this.selSpec.map((item,index)=>{
							if(index!=this.selSpec.length-1){
								goods_attr_id = goods_attr_id+item.id+'_';
							}else{
								goods_attr_id = goods_attr_id+item.id;
							}
						})
						if(this.datas.use_attr){
							// 判断选择的规格是否还有库存
							this.datas.attribute_list.map((item,index)=>{
								if(item.id == goods_attr_id && item.stock<=0){
									uni.showToast({
										title:'该规格库存不足',
										icon:"none"
									})
									return;
								}
							})
						}
						if(this.btnNum == '1'){
							this.tool.getData('/api/mall/addShoppingCart',{
								goods_id:this.id,
								goods_attr_id:goods_attr_id,
								num:this.count
							}).then(res=>{
								if(res){
									this.specFlag = false;
									uni.showToast({
										title:'已添加到购物车',
										icon:'success'
									})
								}
							}).catch(err=>{
								console.log(err);
							})
						}else{
							let shopInfo = [
								{
									id:this.id,
									main_img:this.datas.main_img,
									title:this.datas.title,
									count:this.count,
									specName:this.datas.use_attr?this.selSpecStr:'默认',
									specId:this.datas.use_attr?this.selSpecId:'',
									showPrice:this.showPrice,
								}
							];
							this.specFlag = false;
							uni.navigateTo({
								url:'./beforeOrder?status=1&shopInfo='+JSON.stringify(shopInfo)+'&actType='+this.actType+'&actId='+this.actId,
							})
						}
					}else{//未选择规格
						uni.showToast({
							title:'商品规格选择不完整',
							icon:"none"
						})
					}
				}else{
					this.selSpecStr = '';
					this.selSpecId = '';
					this.selSpec = [];
					uni.showToast({
						title:'库存不足',
						icon:"none"
					})
				}
			},
			// 团长信息
			initCode(){
				this.tool.getData('/api/sell/getGoodsQrcode',{
					goods_id:this.id,
					tjr_mobile:this.mobile,
				}).then(res=>{
					if(res){
						this.Teamcode = res.qr_code;
						this.teamLeader = {
							user_avatar:res.user_avatar,
							user_nickname:res.user_nickname,
						}
					}
				}).catch(err=>{
					console.log(err);
				})
			},
			// 保存图片
			saveImg(){
				this.createImg();
			},
			createImg(){
				uni.showLoading({
					title:'制作中...'
				})
				var ctx = uni.createCanvasContext('myCanvas', this);
				let canvasWidth = uni.getSystemInfoSync().windowWidth * 0.9;
				let canvasHeight = parseInt(this.canvasHeight);
				let thumb = this.datas.main_img;
				setTimeout(()=>{
					// 填充背景色，白色
					ctx.setFillStyle('#FB5D02'); // 默认白色
					ctx.fillRect(0, 0,canvasWidth,canvasHeight); // fillRect(x,y,宽度，高度)
					uni.downloadFile({
						url:this.teamLeader.user_avatar,
						success: (tx) => {
							let txFile = tx.tempFilePath;
							this.tool.circleImgOne(ctx,txFile,12,16,12);
						},
						fail:(err)=>{
							console.log(err);
						},
						complete: () => {
							// 昵称
							let nickname = this.teamLeader.user_nickname;
							ctx.setFontSize(14) // 字号
							ctx.setFillStyle('#ffffff') // 字体颜色
							ctx.fillText(nickname,40,22);//绘制截取部分
							// 提示文字1
							let toast1 = '我觉得这些产品很棒，推荐给你！';
							ctx.setFontSize(12) // 字号
							ctx.setFillStyle('#ffffff') // 字体颜色
							ctx.fillText(toast1,40,40);//绘制截取部分
							// 提示文字2
							let toast2 = '加一精选';
							ctx.setFontSize(14) // 字号
							ctx.setFillStyle('#ffffff') // 字体颜色
							let txtWidth = ctx.measureText(toast2).width;
							ctx.fillText(toast2,canvasWidth - txtWidth - 12,32);//绘制截取部分
							// logo
							this.tool.circleImgOne(ctx,'../static/logo.png',canvasWidth - txtWidth - 44,16,12);
							// 正方形白色边框
							ctx.setFillStyle('#ffffff'); // 默认白色
							ctx.fillRect(12,52,canvasWidth - 24,canvasWidth - 24); // fillRect(x,y,宽度，高度)
							// 产品图
							uni.downloadFile({
								url:thumb,
								success: (shop) => {
									ctx.drawImage(shop.tempFilePath,24,64,canvasWidth - 48,canvasWidth - 48,24,64);
									ctx.drawImage('../static/images/advBox.png',24,64,canvasWidth - 48,canvasWidth - 48,24,64);
								},
								complete: () => {
									// 分享二维码
									ctx.setFillStyle('#ffffff'); // 默认白色
									ctx.fillRect(canvasWidth-142,canvasWidth+38,130,130); // fillRect(x,y,宽度，高度)
									uni.hideLoading();
									uni.showLoading({
										title:'正在为您生成专属分享码...'
									})
									this.tool.base64Save(this.Teamcode).then(code=>{
										ctx.drawImage(code,canvasWidth-142,canvasWidth+38,130,130,canvasWidth-162,canvasWidth - 38);
										// 提示文字3
										let toast3 = '长按扫码选购';
										ctx.setFontSize(24) // 字号
										ctx.setFillStyle('#ffffff') // 字体颜色
										ctx.fillText(toast3,12,canvasWidth+62);//绘制截取部分
										// 价格
										ctx.setFontSize(24) // 字号
										ctx.setFillStyle('#ffffff') // 字体颜色
										ctx.fillText(this.datas.price,62,canvasWidth+6);//绘制截取部分
										// 商品描述文字
										let maxWidth = canvasWidth - 174;
										this.tool.canvasWraptitleText(ctx,this.datas.title,12,canvasWidth+86,maxWidth,22,2);
										// 提示图
										uni.getImageInfo({
											src:'../static/images/toastBtn.png',
											success: (imgInfo) => {
												let imgWidth = maxWidth;
												let imgHeight = maxWidth / (imgInfo.width / imgInfo.height);
												ctx.drawImage('../static/images/toastBtn.png',12,canvasWidth+130,imgWidth,imgHeight);
											},
											fail:(err)=>{
												console.log(err);
											},
											complete: () => {
												ctx.draw(true,()=>{
													setTimeout(()=>{
														uni.canvasToTempFilePath({ // 保存canvas为图片
															canvasId: 'myCanvas',
															quality: 1,
															width:canvasWidth,
															height:canvasHeight,
															destWidth:canvasWidth * 3,
															destHeight:canvasHeight * 3,
															complete: (res)=> {
																console.log(res);
																uni.hideLoading();
																if(res.tempFilePath){
																	uni.saveImageToPhotosAlbum({
																		filePath:res.tempFilePath,
																		success: () => {
																			uni.showToast({
																				title:"图片已保存",
																				icon:'success'
																			})
																			this.tool.monitor(this.link);
																		},
																		fail:(err)=>{
																			console.log(err);
																			uni.showToast({
																				title:'图片保存失败',
																				icon:'none'
																			})
																		}
																	})
																}
															},
														},this) // 这里是新增的this，只有在微信小程序中需要加入，不然会报错
													},1500)
												});
											}
										})
									}).catch(err=>{
										console.log(err);
									})
								}
							})
						}
					})
				},500)
			},
		}
	}
</script>

<style lang="scss">
	page{
		background: #F6F6F6;
	}
	img {
		  width: 100%!important;
	}
	.toolBtns{
		width:48px;
		position:fixed;
		right:12px;
		bottom:70px;
	}
	.ios_sureBtn{
		padding-bottom:env(safe-area-inset-bottom);
	}
	.shopDetail{
		width: 100%;
		// padding:12px 3%;
		// box-sizing: border-box;
		.zz2{
			top: 0;
		}
		.zz3{
			left: -200%;
		}
		.zz{
			.opBtns{
				width: 100%;
				position: absolute;
				bottom: 0;
				left: 0;
				background: white;
				padding:0 0 25px;
				box-sizing: border-box;
				.toast{
					width: 100%;
					text-align:center;
					padding:12px 0;
					color:#666666;
				}
				.close{
					width: 94%;
					margin:6px auto 0;
					text-align:center;
					color:#666666;
					font-size:12px;
				}
				.btns{
					width: 100%;
					position:relative;
					.opBtnOne{
						width: max-content;
						text-align: center;
						font-size: 12px;
						color: #333333;
						.btnImg{
							width: 45px;
							height: 45px;
							margin-bottom: 8px;
						}
					}
				}
			}
			.closeBtn{
				width: max-content;
				padding: 8px 50px;
				margin: 20px auto;
				border-radius: 30px;
				font-size: 12px;
				color: white;
				border: 1px solid white;
			}
			.advImg{
				margin-bottom: 10px!important;
			}
			.spec{
				width: 100%;
				padding: 12px;
				box-sizing: border-box;
				background: white;
				border-top-left-radius:8px;
				border-top-right-radius:8px;
				position: relative;
				margin-bottom: 0;
				.closeIcon{
					position: absolute;
					width: 16px;
					height: 16px;
					top: 12px;
					right: 12px;
				}
				.sureBtn{
					width: 100%;
					padding: 12px 0;
					border-radius: 40px;
					color:white;
					text-align: center;
					background: $col_active;
				}
				.specList{
					margin-bottom: 24px;
					.part{
						width: 100%;
						.tit{
							font-size: 12px;
							margin: 5px 0;
							color: #999999;
							display: block;
						}
						.partList{
							width: 100%;
							.specOne{
								width:auto;
								// width:22%;
								/* overflow:hidden;
								white-space:nowrap;
								text-overflow: ellipsis; */
								text-align: center;
								padding: 6px 12px;
								box-sizing: border-box;
								background: #F6F6F6;
								border-radius: 8px;
								margin-right: 12px;
								margin-bottom: 10px;
								font-weight: 400;
								border: 1px solid #F6F6F6;
							}
							/* .specOne:nth-child(4n+4){
								margin-right: 0;
							} */
							.active{
								background: rgba(252,68,36,0.06);
								color: #FC4424;
								border:1px solid #FC4424;
							}
						}
					}
				}
				.shopInfo{
					width: 100%;
					margin-bottom: 24px;
					.shopImg{
						width:96px;
						height: 96px;
						overflow: hidden;
						background: white;
						margin-right: 12px;
						border-radius: 8px;
					}
					.other{
						flex: 1;
						.price{
							font-size: 18px;
							color: #FC4424;
							font-weight: bold;
						}
						.selSpec{
							font-size: 12px;
							color: #999999;
							margin: 12px 0 6px;
						}
						.shopName{
							font-size: 18px;
							width:90%;
						}
					}
				}
			}  
		}
		// 新人专享推荐
		.tuijian{
			.tj_shop{
				.shopInfo{
					flex:1;
					.huigou{
						font-size:12px;
						display:inline-block;
						margin:5px 0;
						color:#808080;
					}
					.tool{
						width:100%;
						font-size: 12px;
						color:#FF5000;
						.jiagou{
							width:max-content;
							color: white;
							padding: 3px 8px;
							background: #FF5000;
							border-radius: 50px;
						}
						.price{
							text{
								font-size: 15px;
							}
						}
					}
					.shopName{
						width:100%;
						word-break: break-all;
						overflow: hidden;
						display: -webkit-box;
						-webkit-line-clamp: 3;
						-webkit-box-orient: vertical;
						margin-bottom:12px;
					}
				}
				.shopImg{
					.newIcon{
						width:max-content;
						color:white;
						font-size:10px;
						background:#FF5000;
						padding:2px 10px;
						position: absolute;
						top:0;
						left:0;
						border-top-left-radius: 6px;
						border-bottom-right-radius: 6px;
					}
					width:140px;
					height:140px;
					border-radius: 6px;
					overflow:hidden;
					margin-right: 12px;
					position:relative;
				}
				width:100%;
				padding:10px;
				background:white;
				border-radius: 6px;
				margin-bottom:12px;
				position:relative;
			}
			width:calc(100% - 24px);
			margin:0 auto -12px;
			position: relative;
			top:-12px;
		}
		.shopsTit{
			width:100%;
			.menuDesc{
				width:137rpx;
			}
			.titIcon{
				width:40rpx;
				height: 40rpx;
				margin-right:12px;
			}
			width: 100%;
			margin-top:12px;
			padding: 20px 0;
			background: linear-gradient(to bottom,#FEE6DB,#FEFAF8);
		}
		.btns{
			width: 100%;
			padding: 12px;
			box-sizing: border-box;
			background: white;
			position: fixed;
			bottom: 0;
			left: 0;
			.btnRight{
				width: auto;
				color: white;
				font-size: 12px;
				border-radius: 40px;
				border: 1px solid $col_active;
				.addCar{
					padding: 10px 28px;
					border-top-left-radius: 40px;
					border-bottom-left-radius: 40px;
					color:$col_active;
				}
				.buy{
					padding: 10px 28px;
					border-top-right-radius: 40px;
					border-bottom-right-radius: 40px;
					background: #FC4424;
					color:white;
				}
				.loginBtn{
					width:100%;
					box-sizing: border-box;
					padding: 10px 28px;
					border-radius: 40px;
					text-align: center;
					background:$col_active;
					color: white;
				}
			}
			.btnLeft{
				flex:1;
				.btnTool{
					font-size: 12px; 
					margin-right: 15px;
					.btnIcon{
						width: 20px;
						height: 20px;
						margin:0 auto 2px;
					}
				}
				.btnTool:last-child{
					margin: 0;
				}
			}
		}
		.desc{
			width: 100%;
			padding:12px;
			margin-bottom: 12px;
			box-sizing: border-box;
			background: white;
			border-radius: 8px;
			font-weight: bold;
			
			.title{
				margin-bottom: 12px;
			}
			.comment{
				width: 100%;
				.commentOne{
					width: 100%;
					margin-bottom: 12px;
					.content{
						.imgs{
							width: 100%;
							.smallImg{
								margin-right: 5px;
								margin-bottom: 10px;
								position: relative;
							}
							.imgOne{
								width: 100px;
								height: 100px;
								overflow: hidden;
								border-radius: 4px;
								position: relative;
								image{
									width: 100%;
								}
								.smallZz{
									width: 100%;
									height: 100%;
									background: rgba(0, 0, 0, 0.5);
									text-align: center;
									line-height: 100px;
									border-radius: 4px;
									font-size: 20px;
									color:white;
									position: absolute;
									top: 0;
									left: 0;
								}
							}
							.smallImg:nth-child(3n+3){
								margin-right: 0;
							}
						}
						.desc{
							width: 100%;
							margin-bottom: 12px;
							padding: 0;
						}
					}
					.info{
						width: 100%;
						margin-bottom: 10px;
						.userInfo{
							flex:1;
							font-weight: bold;
							.other{
								flex:1;
							}
							.userTx{
								width: 36px;
								height: 36px;
								overflow: hidden;
								border-radius: 50%;
								margin-right: 8px;
								image{
									width: 36px;
									height: 36px;
								}
							}
						}
						.createTime{
							width:auto;
							color: #999999;
							font-size: 12px;
						}
					}
				}
				.commentOne:last-child{
					margin: 0;
				}
			}
		}
		.spec{
			width: 100%;
			padding:12px;
			box-sizing: border-box;
			background: white;
			border-radius: 8px;
			font-weight: bold;
			margin: 12px 0;
			.specVal{
				flex: 1;
				margin-left: 10px;
				.rightIcon{
					width: 16px;
					margin-left: 10px;
				}
				.ipt{
					flex: 1;
					font-weight:400;
					input{
						text-align: right;
					}
				}
			}
		}
		.activePrice{
			.lei{
				width:40px;
				position: absolute;
				top:0;
				right:110px;
			}
			.showPrice{
				.actPrice{
					margin-top:5px;
					text{
						font-size: 16px;
						font-weight: bold;
					}
					.oldPrice{
						display: inline-block;
						margin-left: 5px;
						font-size: 13px;
						color:#ffd6c3;
						text-decoration: line-through;
					}
				}
				flex:1;
				font-size: 14px;
			}
			.showDesc{
				width: max-content;
				font-size: 16px;
			}
			width: 100%;
			padding:12px;
			box-sizing: border-box;
			position:relative;
			background: #ff4f00;
			color: white;
			font-size: 12px;
		}
		.config{
			width: 100%;
			padding:12px;
			box-sizing: border-box;
			background: white;
			border-radius: 8px;
			margin-top:12px;
			.shopName{
				font-size: 16px;
				line-height: 20px;
				font-weight: bold;
				margin-top: 8px;
			}
			.tags{
				width: 100%;
				margin:12px 0 6px;
				.tagOne{
					font-size: 12px;
					width: max-content;
					display: inline-block;
					padding: 0 4px;
					line-height: 16px;
					border:1px solid #FC9700;
					color: #FC9700;
					border-radius: 4px;
					margin-right: 6px;
				}
				.tagOne:last-child{
					margin: 0;
				}
			}
			.prices{
				width: 100%;
				.yongjin{
					width: max-content;
					background: white;
					padding:2px 8px;
					border-radius:50px;
					font-size:12px;
					margin-left:12px;
					box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.1);
					.showYJ{
						width:20px;
						height:20px;
						text-align: center;
						line-height: 20px;
						font-size:10px;
						margin-right: 5px;
						border-radius: 50%;
						color: white;
						background: #FD6524;
					}
				}
				.newPrice{
					font-weight: bold;
					font-size: 16px;
					color: #FF4D00;
					margin-right: 12px;
				}
				.oldPrice{
					font-size: 12px;
					color: #999999;
					text-decoration: line-through;
				}
			}
		}
		.banner{
			background: #E9E9E9;
			image{
				border-radius: 8px;
			}
		}
	}
</style>
